<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="/static/layui/css/layui.css"/>
    <title>房屋租赁网</title>
    <link rel="stylesheet" href="/static/css/global.css">
    <script src="/static/layui/layui.js"></script>
</head>
<body>
<div class="layui-carousel" id="bg-item">
    <div class="layui-header title">
        <div class="layui-container">
            <div class="layui-logo layui-pull-left">
                <img src="/static/img/logo.png" width="240px">
            </div>
            <div test="${not empty loginUser }">
	            <div class="personalCenter layui-pull-right"><a href="toUserSystem" target="_blank" style="color:#fff"><i class="layui-icon layui-icon-tree"></i>返回个人中心</a></div>
            <div>

        </div>
    </div>
        <input>
    <div carousel-item>
        <div style="background: url('../../static/img/banner1.jpg')no-repeat center/cover"></div>
        <div style="background: url('../../static/img/banner2.jpg')no-repeat center/cover"></div>
        <div style="background: url('../../static/img/banner3.jpg')no-repeat center/cover"></div>
        <div style="background: url('../../static/img/banner4.jpg')no-repeat center/cover"></div>
    </div>
</div>

<!--内容开始-->
<div class="list_control_bar layui-container" style="padding: 0">
    <div>
        <div class="list_title layui-pull-left"><span>全部装修方案</span></div>
        <div class="list_more">
            <ul class="layui-pull-right list-item">
                <li class="click-this"><a href="toIndexPage">默认排序</a></li>
                <li><a href="findHousrOrderByAsc">价格升序</a></li>
                <li><a href="findHousrOrderByDesc">价格降序</a></li>
            </ul>
        </div>
    </div>
</div>

<section class="layui-container">
<!--    <hr>-->
<!--&lt;!&ndash;    <h2>目前有<span style="color: #ffc601;margin: 0 5px;">[[${size}]]</span>套房源</h2>&ndash;&gt;-->
<!--    <hr>-->
    <div class="house-detail">
        <ul>
        	<div th:each="h:${houses}" >
	            <li>
	                <a th:href="@{/rent/house/seeHouse/{houseId}(houseId=${h.getHouseId()})}" class="show-image">
	                    <img th:src="@{${h.getHouseImage()}}" width="240px" height="180px">
	                </a>
	                <div class="show-details">
	                    <p class="house-title">
	                        <a th:href="@{/rent/house/seeHouse/{houseId}(houseId=${h.getHouseId()})}" th:value="${h.getHouseDesc()}"></a>
	                    </p>
	                    <p class="house-about">
	                        <span class="layui-icon layui-icon-home"></span>
	                        <span>[[${h.getHouseType()}]]</span>
	                        <span class="flag-line">|</span>
	                        <span>[[${h.getHouseArea()}]] m<sup>2</sup></span>
	                        <span class="flag-line">|</span>
	                        <span>联系号码: [[${h.getHouseTel()}]]</span>
	                        <span class="flag-line">|</span>
	                    </p>
	                    <p class="house-address clearfix">
	                        <span class="layui-icon layui-icon-location"></span>
	                        <span class="whole-line">
			    		        <span>[[${h.getHouseAddress()}]]</span>
					        </span>
	                    </p>
	                    <div class="show-price">
	                        <span class="sale-price">[[${h.getHousePrice()}]]</span>
	                        <span class="sale-unit">元/月</span>
	                    </div>
                        <p class="house-address clearfix" style="color: #28ff73">
                            <span class="layui-icon"></span>
                            <span class="whole-line" style="color: #009E94">
			    		        <span>[[${h.getHouseDesc()}]]</span>
					        </span>
                        </p>
	                </div>
	            </li>
        	</div>
        </ul>
    </div>
</section>
<footer>

</footer>
<script>
    layui.use(['element', 'carousel','layer','form'], function () {
        var element = layui.element,
            carousel = layui.carousel,
            $ = layui.jquery,
            layer = layui.layer,
            form = layui.form;

        var layer_index;
        carousel.render({
            elem:"#bg-item",
            width:"100%",
            height:"600px",
            anim:"fade"
        });
        $('.operation').click(function () {
        	layer_index = layer.open({
                type:1,
                content:$('#sign'),
                area:['360px','460px'],
                title:"房屋租赁",
                closeBtn:2
            });
        });
        $('.list-item li').click(function () {
            $('.list-item li').removeClass('click-this');
            $(this).addClass('click-this');
        });
    });
</script>
</body>
</html>
